<template>
	<div id="track">
		<el-tabs v-model="activeName" @tab-click="handleClick">
			<el-tab-pane label="查看表单" name="first">查看表单</el-tab-pane>
			<el-tab-pane label="轨迹图" name="second">
				<trajectory></trajectory>
			</el-tab-pane>
			<el-tab-pane label="时间轴" name="third">
				<timeBase></timeBase>
			</el-tab-pane>
			<el-tab-pane label="时间表" name="fourth">
				<timeTable></timeTable>
			</el-tab-pane>
			<el-tab-pane label="操作" name="operation">操作</el-tab-pane>
		</el-tabs>
	</div>
</template>

<script>
import timeBase from './timeBase.vue'//时间轴
import trajectory from './trajectory.vue' //轨迹图
import timeTable from './timeTable.vue'
export default {
	name: "track",
	data() {
		return {
			activeName: "second",
			params: {},
			data: []
		};
	},

	beforeCreate() {},

	created() {
		console.log("dd");
		// this.loadData();
	},
	mounted(){
		this.params = this.$store.getters.getData;
		console.log("轨迹图父组件",this.params);
		this.loadData();
	},
	methods: {
		// 获取轨迹图、时间轴、时间表数据
		loadData() {
			var handler = new this.HttpHandler("BP.WF.HttpHandler.WF_WorkOpt_OneWork");
            // handler.AddPara("FK_Flow", fk_Flow);
            // handler.AddPara("WorkID", work_ID);
			// handler.AddPara("FID", fid);
			
			handler.AddJson(this.params);
            var data = handler.DoMethodReturnString("Chart_Init");

            if (data.indexOf('err@') == 0) {
                alert(data);
                return;
			}
			
			console.log('获取轨迹图数据',data);
			this.data = JSON.parse(data);
			this.$store.commit('setTrack', this.data) //设置数据
			console.log('获取vuex',this.$store.getters.getTrack);
			setTimeout(() => {
				this.$Bus.$emit("track")
			}, 500);
			
		},

		handleClick(tab, event) {
			console.log(tab, event);
		}
	},

	//监听
	computed: {},

	components: {
		timeBase,
		trajectory,
		timeTable
	},

	//监听后执行动作
	watch: {}
};
</script>

<style lang="less" scoped>
</style>